<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<title>教师风采</title>

	<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
	<link rel="stylesheet" href="css/main.css">
	<link rel="stylesheet" href="css/school_teacher_detalis.css">
</head>

<body>
	<div id="container">
		<div class="contain" id="vue-root">
			<div class="header" style="margin-bottom: 20px;">
				<div class="header_title">教师风采</div>
				<a onclick="history.back()">
					<img src="image/return.png" alt="" class="return">
				</a>
			</div>
			<div class="teacher_info header-after">
				<div class="title">
					<div class="teacher">
						<p class="name" v-text="item.name"></p>
						<p class="intro" v-text="item.level"></p>
					</div>
				</div>
				<div class="img_box" v-if="item.pic">
					<img :src="getImg(item.pic)" class="notice_img">
				</div>
				<p class="teacher_introduce">教师简介:
				<div class="teacher_introduction">
					<span class="introduction" v-text="item.intro"></span>
				</div>
				</p>
				<p class="teacher_introduce">教学经验:
				<div class="teacher_introduction">
					<span class="text" v-text="item.experience"></span>
				</div>
				</p>
			</div>
		</div>
	</div>

	<script src="/scriptZIP/qs.min.js"></script>
	<script src="/scriptZIP/vue.min.js"></script>
	<script src="/scriptZIP/axios.min.js"></script>

	<script src="/js/common.js"></script>

	<script>
		var app = new Vue({
			el: '#vue-root',
			data: {
				item: {},
			},
			created: function () {
				axios.get('/api/teacherMien/' + params().id).then(function (res) {
					this.item = res.data;
				}.bind(this));
			},
			methods: {
				getImg: function (pic) {
					return '/static/' + this.item.schoolId + '/teacherMien/' + pic;
				}
			}
		});
	</script>

</body>

</html>